53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import { TbPhotoShare } from 'react-icons/tb';
|
|
import { clsx } from 'clsx/lite';
|
|
import LoaderButton from '@/components/primitives/LoaderButton';
|
|
import { useAppState } from '@/state/AppState';
|
|
import { getSharePathFromShareModalProps, ShareModalProps } from '.';
|
|
import { useEffect } from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
|
|
let prefetchedImage: HTMLImageElement | null = null;
|
|
|
|
export default function ShareButton({
|
|
title,
|
|
dim,
|
|
prefetch,
|
|
className,
|
|
...rest
|
|
}: {
|
|
title?: string
|
|
dim?: boolean
|
|
prefetch?: boolean
|
|
className?: string
|
|
} & ShareModalProps) {
|
|
const { setShareModalProps } = useAppState();
|
|
|
|
const router = useRouter();
|
|
|
|
const absoluteImagePath = getSharePathFromShareModalProps({ ...rest });
|
|
|
|
useEffect(() => {
|
|
if (prefetch && absoluteImagePath) {
|
|
prefetchedImage = new Image();
|
|
prefetchedImage.src = absoluteImagePath;
|
|
}
|
|
}, [prefetch, absoluteImagePath, router]);
|
|
|
|
return (
|
|
<LoaderButton
|
|
title={title}
|
|
onClick={() => setShareModalProps?.({ ...rest })}
|
|
className={clsx(
|
|
className,
|
|
dim ? 'text-dim' : 'text-medium',
|
|
)}
|
|
icon={<TbPhotoShare size={16} />}
|
|
spinnerColor="dim"
|
|
styleAs="link"
|
|
hideFocusOutline
|
|
/>
|
|
);
|
|
}
|