reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Release v4.1 (#229)

Browse Source 
* refactor: remove custom icon packs

* fix: command not work on windows

* fix: make open_window command async

* feat: improve commands

* feat: improve

* refactor: column

* feat: improve thread column

* feat: improve

* feat: add stories column

* feat: improve

* feat: add search column

* feat: add reset password

* feat: add subscription

* refactor: settings

* chore: improve commands

* fix: crash on production

* feat: use tauri store plugin for cache

* feat: new icon

* chore: update icon for windows

* chore: improve some columns

* chore: polish code
This commit is contained in:
雨宮蓮
2024-08-27 19:37:30 +07:00
committed by GitHub
parent 26ae473521
commit 61ad96ca63
318 changed files with 5564 additions and 8458 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/note/preview/images.tsx
View File

@@ -1,14 +1,12 @@
import { cn } from "@/commons";
import { appSettings, cn } from "@/commons";
import { Spinner } from "@/components";
import { ArrowLeftIcon, ArrowRightIcon } from "@/components";
import { useRouteContext } from "@tanstack/react-router";
import { ArrowLeft, ArrowRight } from "@phosphor-icons/react";
import { useStore } from "@tanstack/react-store";
import { open } from "@tauri-apps/plugin-shell";
import useEmblaCarousel from "embla-carousel-react";
import { useCallback, useEffect, useMemo, useState } from "react";
export function Images({ urls }: { urls: string[] }) {
const { settings } = useRouteContext({ strict: false });
const [slidesInView, setSlidesInView] = useState([]);
const [emblaRef, emblaApi] = useEmblaCarousel({
dragFree: true,
@@ -16,19 +14,19 @@ export function Images({ urls }: { urls: string[] }) {
watchSlides: false,
});
const service = useStore(appSettings, (state) => state.image_resize_service);
const imageUrls = useMemo(() => {
if (settings.image_resize_service.length) {
if (service?.length) {
let newUrls: string[];
if (urls.length === 1) {
newUrls = urls.map(
(url) =>
`${settings.image_resize_service}?url=${url}&ll&af&default=1&n=-1`,
(url) => `${service}?url=${url}&ll&af&default=1&n=-1`,
);
} else {
newUrls = urls.map(
(url) =>
`${settings.image_resize_service}?url=${url}&w=480&h=640&ll&af&default=1&n=-1`,
(url) => `${service}?url=${url}&w=480&h=640&ll&af&default=1&n=-1`,
);
}
@@ -36,7 +34,7 @@ export function Images({ urls }: { urls: string[] }) {
} else {
return urls;
}
}, [settings.image_resize_service]);
}, [service]);
const scrollPrev = useCallback(() => {
if (emblaApi) emblaApi.scrollPrev();
@@ -80,7 +78,6 @@ export function Images({ urls }: { urls: string[] }) {
<img
src={imageUrls[0]}
alt={urls[0]}
loading="lazy"
decoding="async"
style={{ contentVisibility: "auto" }}
className="max-h-[400px] w-auto object-cover rounded-lg outline outline-1 -outline-offset-1 outline-black/15"
@@ -119,7 +116,7 @@ export function Images({ urls }: { urls: string[] }) {
)}
onClick={() => scrollPrev()}
>
<ArrowLeftIcon className="size-6" />
<ArrowLeft className="size-6" />
</button>
<button
type="button"
@@ -130,7 +127,7 @@ export function Images({ urls }: { urls: string[] }) {
)}
onClick={() => scrollNext()}
>
<ArrowRightIcon className="size-6" />
<ArrowRight className="size-6" />
</button>
</div>
</div>
@@ -159,7 +156,6 @@ function LazyImage({ url, inView }: { url: string; inView: boolean }) {
}
data-src={url}
alt={url}
loading="lazy"
decoding="async"
style={{ contentVisibility: "auto" }}
className="object-cover w-full h-full rounded-lg outline outline-1 -outline-offset-1 outline-black/15"