pangolin_mirror/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-02-25 06:16:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

♻️ refactor

Browse Source
This commit is contained in:
Fred KISSIE
2025-11-06 00:06:05 +01:00
parent 41601010f4
commit 096ca379ce
1 changed files with 31 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
src/components/ProductUpdates.tsx
View File

@@ -13,7 +13,7 @@ import {
XIcon XIcon
} from "lucide-react"; } from "lucide-react";
import { useTranslations } from "next-intl"; import { useTranslations } from "next-intl";
import { Transition, TransitionChild } from "@headlessui/react"; import { Transition } from "@headlessui/react";
import * as React from "react"; import * as React from "react";
export default function ProductUpdates({ export default function ProductUpdates({
@@ -38,7 +38,7 @@ export default function ProductUpdates({
const t = useTranslations(); const t = useTranslations();
const [showMoreUpdatesText, setShowMoreUpdatesText] = React.useState(false); const [showMoreUpdatesText, setShowMoreUpdatesText] = React.useState(false);
// we delay the small text so that the user can notice it // we delay the small text animation so that the user can notice it
React.useEffect(() => { React.useEffect(() => {
const timeout = setTimeout(() => setShowMoreUpdatesText(true), 600); const timeout = setTimeout(() => setShowMoreUpdatesText(true), 600);
return () => clearTimeout(timeout); return () => clearTimeout(timeout);
@@ -64,37 +64,35 @@ export default function ProductUpdates({
isCollapsed && "hidden" isCollapsed && "hidden"
)} )}
> >
<> <div className="flex flex-col gap-1">
<div className="flex flex-col gap-1"> <small
<small className={cn(
className={cn( "text-xs text-muted-foreground flex items-center gap-1 mt-2",
"text-xs text-muted-foreground flex items-center gap-1 mt-2", showMoreUpdatesText
showMoreUpdatesText ? "animate-in fade-in duration-300"
? "animate-in fade-in duration-300" : "opacity-0"
: "opacity-0" )}
)} >
> {data.updates.length > 0 && (
{data.updates.length > 0 && ( <>
<> <BellIcon className="flex-none size-3" />
<BellIcon className="flex-none size-3" /> <span>
<span> {showNewVersionPopup
{showNewVersionPopup ? t("productUpdateMoreInfo", {
? t("productUpdateMoreInfo", { noOfUpdates: data.updates.length
noOfUpdates: data.updates.length })
}) : t("productUpdateInfo", {
: t("productUpdateInfo", { noOfUpdates: data.updates.length
noOfUpdates: data.updates.length })}
})} </span>
</span> </>
</> )}
)} </small>
</small> <ProductUpdatesPopup
<ProductUpdatesPopup updates={data.updates}
updates={data.updates} show={data.updates.length > 0}
show={data.updates.length > 0} />
/> </div>
</div>
</>
<NewVersionAvailable <NewVersionAvailable
version={data.latestVersion?.data} version={data.latestVersion?.data}