disable resume previews to lower load on server, fixes #1954

This commit is contained in:
Amruth Pillai
2024-06-13 11:40:17 +02:00
parent 713ce91683
commit 767573ce6d
3 changed files with 8 additions and 68 deletions

View File

@ -1,6 +1,5 @@
import { t } from "@lingui/macro";
import {
CircleNotch,
CopySimple,
FolderOpen,
Lock,
@ -21,7 +20,6 @@ import dayjs from "dayjs";
import { AnimatePresence, motion } from "framer-motion";
import { useNavigate } from "react-router-dom";
import { useResumePreview } from "@/client/services/resume/preview";
import { useDialog } from "@/client/stores/dialog";
import { BaseCard } from "./base-card";
@ -35,8 +33,6 @@ export const ResumeCard = ({ resume }: Props) => {
const { open } = useDialog<ResumeDto>("resume");
const { open: lockOpen } = useDialog<ResumeDto>("lock");
const { url, loading } = useResumePreview(resume.id);
const lastUpdated = dayjs().to(resume.updatedAt);
const onOpen = () => {
@ -63,36 +59,6 @@ export const ResumeCard = ({ resume }: Props) => {
<ContextMenu>
<ContextMenuTrigger>
<BaseCard className="space-y-0" onClick={onOpen}>
<AnimatePresence presenceAffectsLayout>
{loading && (
<motion.div
layout
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
>
<CircleNotch
size={64}
weight="thin"
opacity={0.5}
className="animate-spin self-center justify-self-center"
/>
</motion.div>
)}
{!loading && url && (
<motion.img
layout
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
loading="lazy"
alt={resume.title}
className="size-full object-cover"
src={`${url}?cache=${Date.now()}`}
/>
)}
</AnimatePresence>
<AnimatePresence>
{resume.locked && (
<motion.div

View File

@ -20,15 +20,10 @@ import {
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
HoverCard,
HoverCardContent,
HoverCardTrigger,
} from "@reactive-resume/ui";
import dayjs from "dayjs";
import { AnimatePresence, motion } from "framer-motion";
import { useNavigate } from "react-router-dom";
import { useResumePreview } from "@/client/services/resume/preview";
import { useDialog } from "@/client/stores/dialog";
import { BaseListItem } from "./base-item";
@ -42,8 +37,6 @@ export const ResumeListItem = ({ resume }: Props) => {
const { open } = useDialog<ResumeDto>("resume");
const { open: lockOpen } = useDialog<ResumeDto>("lock");
const { url } = useResumePreview(resume.id);
const lastUpdated = dayjs().to(resume.updatedAt);
const onOpen = () => {
@ -140,32 +133,13 @@ export const ResumeListItem = ({ resume }: Props) => {
return (
<ContextMenu>
<ContextMenuTrigger className="even:bg-secondary/20">
<HoverCard>
<HoverCardTrigger>
<BaseListItem
className="group"
title={resume.title}
description={t`Last updated ${lastUpdated}`}
end={dropdownMenu}
onClick={onOpen}
/>
</HoverCardTrigger>
<HoverCardContent align="end" className="p-0" sideOffset={-100} alignOffset={100}>
<AnimatePresence>
{url && (
<motion.img
layout
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
loading="lazy"
alt={resume.title}
className="aspect-[1/1.4142] w-60 rounded-sm object-cover"
src={`${url}?cache=${Date.now()}`}
/>
)}
</AnimatePresence>
</HoverCardContent>
</HoverCard>
<BaseListItem
className="group"
title={resume.title}
description={t`Last updated ${lastUpdated}`}
end={dropdownMenu}
onClick={onOpen}
/>
</ContextMenuTrigger>
<ContextMenuContent>

View File

@ -1,7 +1,7 @@
{
"name": "@reactive-resume/source",
"description": "A free and open-source resume builder that simplifies the process of creating, updating, and sharing your resume.",
"version": "4.1.7",
"version": "4.1.8",
"license": "MIT",
"private": true,
"author": {