mirror of
https://github.com/immich-app/immich.git
synced 2025-03-11 02:23:09 -05:00
Fixed webp upload on web (#460)
This commit is contained in:
Alex
GitHub
parent
4b34f017ca
commit
a388c5a642
2 changed files with 142 additions and 140 deletions
|
|
@ -63,7 +63,7 @@ async function fileUploader(asset: File, uploadType: UploadType) {
|
||||||
let exifData = null;
|
let exifData = null;
|
||||||
|
|
||||||
if (assetType !== 'VIDEO') {
|
if (assetType !== 'VIDEO') {
|
||||||
exifData = await exifr.parse(asset);
|
exifData = await exifr.parse(asset).catch((e) => console.log('error parsing exif', e));
|
||||||
}
|
}
|
||||||
|
|
||||||
const createdAt =
|
const createdAt =
|
||||||
|
|
|
||||||
|
|
@ -1,179 +1,181 @@
|
||||||
<script context="module" lang="ts">
|
<script context="module" lang="ts">
|
||||||
import type { Load } from '@sveltejs/kit';
|
import type { Load } from '@sveltejs/kit';
|
||||||
import { api, UserResponseDto } from '@api';
|
import { api, UserResponseDto } from '@api';
|
||||||
import { browser } from '$app/env';
|
import { browser } from '$app/env';
|
||||||
|
|
||||||
export const load: Load = async ({fetch, session}) => {
|
export const load: Load = async ({ fetch, session }) => {
|
||||||
if (!browser && !session.user) {
|
if (!browser && !session.user) {
|
||||||
return {
|
return {
|
||||||
status: 302,
|
status: 302,
|
||||||
redirect: '/auth/login'
|
redirect: '/auth/login'
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const user: UserResponseDto = await fetch('/data/user/get-my-user-info').then((r) => r.json());
|
const user: UserResponseDto = await fetch('/data/user/get-my-user-info').then((r) =>
|
||||||
const allUsers: UserResponseDto[] = await fetch('/data/user/get-all-users?isAll=false').then((r) => r.json());
|
r.json()
|
||||||
|
);
|
||||||
|
const allUsers: UserResponseDto[] = await fetch('/data/user/get-all-users?isAll=false').then(
|
||||||
|
(r) => r.json()
|
||||||
|
);
|
||||||
|
|
||||||
if (!user.isAdmin) {
|
if (!user.isAdmin) {
|
||||||
return {
|
return {
|
||||||
status: 302,
|
status: 302,
|
||||||
redirect: '/photos'
|
redirect: '/photos'
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
status: 200,
|
status: 200,
|
||||||
props: {
|
props: {
|
||||||
user: user,
|
user: user,
|
||||||
allUsers: allUsers
|
allUsers: allUsers
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
return {
|
return {
|
||||||
status: 302,
|
status: 302,
|
||||||
redirect: '/auth/login'
|
redirect: '/auth/login'
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { onMount } from 'svelte';
|
import { onMount } from 'svelte';
|
||||||
|
|
||||||
import { AdminSideBarSelection } from '$lib/models/admin-sidebar-selection';
|
import { AdminSideBarSelection } from '$lib/models/admin-sidebar-selection';
|
||||||
import SideBarButton from '$lib/components/shared-components/side-bar/side-bar-button.svelte';
|
import SideBarButton from '$lib/components/shared-components/side-bar/side-bar-button.svelte';
|
||||||
import AccountMultipleOutline from 'svelte-material-icons/AccountMultipleOutline.svelte';
|
import AccountMultipleOutline from 'svelte-material-icons/AccountMultipleOutline.svelte';
|
||||||
import NavigationBar from '$lib/components/shared-components/navigation-bar.svelte';
|
import NavigationBar from '$lib/components/shared-components/navigation-bar.svelte';
|
||||||
import UserManagement from '$lib/components/admin-page/user-management.svelte';
|
import UserManagement from '$lib/components/admin-page/user-management.svelte';
|
||||||
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
|
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
|
||||||
import CreateUserForm from '$lib/components/forms/create-user-form.svelte';
|
import CreateUserForm from '$lib/components/forms/create-user-form.svelte';
|
||||||
import EditUserForm from '$lib/components/forms/edit-user-form.svelte';
|
import EditUserForm from '$lib/components/forms/edit-user-form.svelte';
|
||||||
import StatusBox from '$lib/components/shared-components/status-box.svelte';
|
import StatusBox from '$lib/components/shared-components/status-box.svelte';
|
||||||
|
|
||||||
|
let selectedAction: AdminSideBarSelection = AdminSideBarSelection.USER_MANAGEMENT;
|
||||||
|
|
||||||
let selectedAction: AdminSideBarSelection = AdminSideBarSelection.USER_MANAGEMENT;
|
export let user: UserResponseDto;
|
||||||
|
export let allUsers: UserResponseDto[];
|
||||||
|
|
||||||
export let user: UserResponseDto;
|
let editUser: UserResponseDto;
|
||||||
export let allUsers: UserResponseDto[];
|
|
||||||
|
|
||||||
let editUser: UserResponseDto;
|
let shouldShowEditUserForm = false;
|
||||||
|
let shouldShowCreateUserForm = false;
|
||||||
|
let shouldShowInfoPanel = false;
|
||||||
|
|
||||||
let shouldShowEditUserForm = false;
|
const onButtonClicked = (buttonType: CustomEvent) => {
|
||||||
let shouldShowCreateUserForm = false;
|
selectedAction = buttonType.detail['actionType'] as AdminSideBarSelection;
|
||||||
let shouldShowInfoPanel = false;
|
};
|
||||||
|
|
||||||
const onButtonClicked = (buttonType: CustomEvent) => {
|
onMount(() => {
|
||||||
selectedAction = buttonType.detail['actionType'] as AdminSideBarSelection;
|
selectedAction = AdminSideBarSelection.USER_MANAGEMENT;
|
||||||
};
|
});
|
||||||
|
|
||||||
onMount(() => {
|
const onUserCreated = async () => {
|
||||||
selectedAction = AdminSideBarSelection.USER_MANAGEMENT;
|
const { data } = await api.userApi.getAllUsers(false);
|
||||||
});
|
allUsers = data;
|
||||||
|
shouldShowCreateUserForm = false;
|
||||||
|
};
|
||||||
|
|
||||||
const onUserCreated = async () => {
|
const editUserHandler = async (event: CustomEvent) => {
|
||||||
const {data} = await api.userApi.getAllUsers(false);
|
const { user } = event.detail;
|
||||||
allUsers = data;
|
editUser = user;
|
||||||
shouldShowCreateUserForm = false;
|
shouldShowEditUserForm = true;
|
||||||
};
|
};
|
||||||
|
|
||||||
const editUserHandler = async (event: CustomEvent) => {
|
const onEditUserSuccess = async () => {
|
||||||
const {user} = event.detail;
|
const { data } = await api.userApi.getAllUsers(false);
|
||||||
editUser = user;
|
allUsers = data;
|
||||||
shouldShowEditUserForm = true;
|
shouldShowEditUserForm = false;
|
||||||
};
|
};
|
||||||
|
|
||||||
const onEditUserSuccess = async () => {
|
const onEditPasswordSuccess = async () => {
|
||||||
const {data} = await api.userApi.getAllUsers(false);
|
const { data } = await api.userApi.getAllUsers(false);
|
||||||
allUsers = data;
|
allUsers = data;
|
||||||
shouldShowEditUserForm = false;
|
shouldShowEditUserForm = false;
|
||||||
}
|
shouldShowInfoPanel = true;
|
||||||
|
};
|
||||||
const onEditPasswordSuccess = async () => {
|
|
||||||
const {data} = await api.userApi.getAllUsers(false);
|
|
||||||
allUsers = data;
|
|
||||||
shouldShowEditUserForm = false;
|
|
||||||
shouldShowInfoPanel = true;
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<svelte:head>
|
<svelte:head>
|
||||||
<title>Administration - Immich</title>
|
<title>Administration - Immich</title>
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<NavigationBar {user}/>
|
<NavigationBar {user} />
|
||||||
|
|
||||||
{#if shouldShowCreateUserForm}
|
{#if shouldShowCreateUserForm}
|
||||||
<FullScreenModal on:clickOutside={() => (shouldShowCreateUserForm = false)}>
|
<FullScreenModal on:clickOutside={() => (shouldShowCreateUserForm = false)}>
|
||||||
<CreateUserForm on:user-created={onUserCreated}/>
|
<CreateUserForm on:user-created={onUserCreated} />
|
||||||
</FullScreenModal>
|
</FullScreenModal>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if shouldShowEditUserForm}
|
{#if shouldShowEditUserForm}
|
||||||
<FullScreenModal on:clickOutside={() => (shouldShowEditUserForm = false)}>
|
<FullScreenModal on:clickOutside={() => (shouldShowEditUserForm = false)}>
|
||||||
<EditUserForm user={editUser} on:edit-success={onEditUserSuccess}
|
<EditUserForm
|
||||||
on:reset-password-success={onEditPasswordSuccess}/>
|
user={editUser}
|
||||||
</FullScreenModal>
|
on:edit-success={onEditUserSuccess}
|
||||||
|
on:reset-password-success={onEditPasswordSuccess}
|
||||||
|
/>
|
||||||
|
</FullScreenModal>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if shouldShowInfoPanel}
|
{#if shouldShowInfoPanel}
|
||||||
<FullScreenModal on:clickOutside={() => (shouldShowInfoPanel = false)}>
|
<FullScreenModal on:clickOutside={() => (shouldShowInfoPanel = false)}>
|
||||||
|
<div class="border bg-white shadow-sm w-[500px] rounded-3xl p-8 text-sm">
|
||||||
|
<h1 class="font-bold text-immich-primary text-lg mb-4">Password reset success</h1>
|
||||||
|
|
||||||
<div class="border bg-white shadow-sm w-[500px] rounded-3xl p-8 text-sm">
|
<p>
|
||||||
<h1 class="font-bold text-immich-primary text-lg mb-4">Password reset success</h1>
|
The user's password has been reset to the default <code
|
||||||
|
class="font-bold bg-gray-200 px-2 py-1 rounded-md text-immich-primary">password</code
|
||||||
|
>
|
||||||
|
<br />
|
||||||
|
Please inform the user, and they will need to change the password at the next log-on.
|
||||||
|
</p>
|
||||||
|
|
||||||
<p>
|
<div class="flex w-full">
|
||||||
The user's password has been reset to the default <code
|
<button
|
||||||
class="font-bold bg-gray-200 px-2 py-1 rounded-md text-immich-primary">password</code>
|
on:click={() => (shouldShowInfoPanel = false)}
|
||||||
<br>
|
class="mt-6 bg-immich-primary hover:bg-immich-primary/75 px-6 py-3 text-white rounded-full shadow-md w-full font-medium"
|
||||||
Please inform the user, and they will need to change the password at the next log-on.
|
>Done
|
||||||
</p>
|
</button>
|
||||||
|
</div>
|
||||||
<div class="flex w-full">
|
</div>
|
||||||
<button
|
</FullScreenModal>
|
||||||
on:click={() => shouldShowInfoPanel = false}
|
|
||||||
class="mt-6 bg-immich-primary hover:bg-immich-primary/75 px-6 py-3 text-white rounded-full shadow-md w-full font-medium"
|
|
||||||
>Done
|
|
||||||
</button
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</FullScreenModal>
|
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
|
||||||
<section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
|
<section class="grid grid-cols-[250px_auto] relative pt-[72px] h-screen">
|
||||||
<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col">
|
<section id="admin-sidebar" class="pt-8 pr-6 flex flex-col">
|
||||||
<SideBarButton
|
<SideBarButton
|
||||||
title="User"
|
title="User"
|
||||||
logo={AccountMultipleOutline}
|
logo={AccountMultipleOutline}
|
||||||
actionType={AdminSideBarSelection.USER_MANAGEMENT}
|
actionType={AdminSideBarSelection.USER_MANAGEMENT}
|
||||||
isSelected={selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
isSelected={selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
||||||
on:selected={onButtonClicked}
|
on:selected={onButtonClicked}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<div class="mb-6 mt-auto">
|
<div class="mb-6 mt-auto">
|
||||||
<StatusBox/>
|
<StatusBox />
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section class="overflow-y-auto relative">
|
<section class="overflow-y-auto relative">
|
||||||
<div id="setting-title" class="pt-10 fixed w-full z-50 bg-immich-bg">
|
<div id="setting-title" class="pt-10 fixed w-full z-50 bg-immich-bg">
|
||||||
<h1 class="text-lg ml-8 mb-4 text-immich-primary font-medium">{selectedAction}</h1>
|
<h1 class="text-lg ml-8 mb-4 text-immich-primary font-medium">{selectedAction}</h1>
|
||||||
<hr/>
|
<hr />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<section id="setting-content" class="relative pt-[85px] flex place-content-center">
|
|
||||||
<section class="w-[800px] pt-4">
|
|
||||||
{#if selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
|
||||||
<UserManagement
|
|
||||||
{allUsers}
|
|
||||||
on:create-user={() => (shouldShowCreateUserForm = true)}
|
|
||||||
on:edit-user={editUserHandler}
|
|
||||||
/>
|
|
||||||
{/if}
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
|
<section id="setting-content" class="relative pt-[85px] flex place-content-center">
|
||||||
|
<section class="w-[800px] pt-4">
|
||||||
|
{#if selectedAction === AdminSideBarSelection.USER_MANAGEMENT}
|
||||||
|
<UserManagement
|
||||||
|
{allUsers}
|
||||||
|
on:create-user={() => (shouldShowCreateUserForm = true)}
|
||||||
|
on:edit-user={editUserHandler}
|
||||||
|
/>
|
||||||
|
{/if}
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
|
</section>
|
||||||
</section>
|
</section>
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue