Add ablum feature to web (#352)

* Added album page

* Refactor sidebar

* Added album assets count info

* Added album viewer page

* Refactor album sorting

* Fixed incorrectly showing selected asset in album selection

* Improve fetching speed with prefetch

* Refactor to use ImmichThubmnail component for all

* Update to the latest version of Svelte

* Implement fixed app bar in album viewer

* Added shared user avatar

* Correctly get all owned albums, including shared
This commit is contained in:
Alex 2022-07-15 23:18:17 -05:00 committed by GitHub
parent 1887b5a860
commit 7134f93eb8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
62 changed files with 2572 additions and 991 deletions

View file

@ -7,7 +7,7 @@
import { fade, fly, slide } from 'svelte/transition';
import { serverEndpoint } from '../../constants';
import TrayArrowUp from 'svelte-material-icons/TrayArrowUp.svelte';
import { clickOutside } from './click-outside';
import { clickOutside } from '../../utils/click-outside';
import { api } from '@api';
export let user: ImmichUser;
@ -56,7 +56,7 @@
<section id="dashboard-navbar" class="fixed w-screen z-[100] bg-immich-bg text-sm">
<div class="flex border-b place-items-center px-6 py-2 ">
<a class="flex gap-2 place-items-center hover:cursor-pointer" href="/photos">
<a sveltekit:prefetch class="flex gap-2 place-items-center hover:cursor-pointer" href="/photos">
<img src="/immich-logo.svg" alt="immich logo" height="35" width="35" />
<h1 class="font-immich-title text-2xl text-immich-primary">IMMICH</h1>
</a>
@ -76,12 +76,13 @@
{/if}
{#if user.isAdmin}
<button
class={`flex place-items-center place-content-center gap-2 hover:bg-immich-primary/5 p-2 rounded-lg font-medium ${
$page.url.pathname == '/admin' && 'text-immich-primary underline'
}`}
on:click={navigateToAdmin}>Administration</button
>
<a sveltekit:prefetch href={`admin`}>
<button
class={`flex place-items-center place-content-center gap-2 hover:bg-immich-primary/5 p-2 rounded-lg font-medium ${
$page.url.pathname == '/admin' && 'text-immich-primary underline'
}`}>Administration</button
>
</a>
{/if}
<div
@ -125,7 +126,7 @@
id="account-info-panel"
class="absolute right-[25px] top-[75px] bg-white shadow-lg rounded-2xl w-[360px] text-center"
use:clickOutside
on:outclick={() => (shouldShowAccountInfoPanel = false)}
on:out-click={() => (shouldShowAccountInfoPanel = false)}
>
<div class="flex place-items-center place-content-center mt-6">
<button