This repository has no description
0

Configure Feed

Select the types of activity you want to include in your feed.

feat: move share button to header

+97 -34
+4
src/webapp/app/(dashboard)/url/layout.tsx
··· 1 1 import BackButton from '@/components/navigation/backButton/BackButton'; 2 2 import Header from '@/components/navigation/header/Header'; 3 3 import ReaderHeaderButton from '@/features/reader/components/ReaderHeaderButton/ReaderHeaderButton'; 4 + import ShareHeaderButton from '@/features/semble/components/ShareHeaderButton/ShareHeaderButton'; 4 5 import { Fragment, Suspense } from 'react'; 5 6 6 7 interface Props { ··· 14 15 <BackButton /> 15 16 <Suspense fallback={null}> 16 17 <ReaderHeaderButton /> 18 + </Suspense> 19 + <Suspense fallback={null}> 20 + <ShareHeaderButton /> 17 21 </Suspense> 18 22 </Header> 19 23 {props.children}
+46
src/webapp/features/collections/components/CollectionShareHeaderButton/CollectionShareHeaderButton.tsx
··· 1 + 'use client'; 2 + 3 + import { ActionIcon, CopyButton, Tooltip } from '@mantine/core'; 4 + import { notifications } from '@mantine/notifications'; 5 + import { MdIosShare } from 'react-icons/md'; 6 + 7 + interface Props { 8 + handle: string; 9 + rkey: string; 10 + } 11 + 12 + export default function CollectionShareHeaderButton(props: Props) { 13 + const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/profile/${props.handle}/collections/${props.rkey}`; 14 + 15 + return ( 16 + <CopyButton value={shareLink}> 17 + {({ copied, copy }) => ( 18 + <Tooltip 19 + label={copied ? 'Link copied!' : 'Share'} 20 + withArrow 21 + position="top" 22 + > 23 + <ActionIcon 24 + variant="light" 25 + color="gray" 26 + size={36} 27 + radius={'xl'} 28 + onClick={(e) => { 29 + e.stopPropagation(); 30 + copy(); 31 + 32 + if (copied) return; 33 + notifications.show({ 34 + message: 'Link copied!', 35 + position: 'top-center', 36 + id: `${props.handle}/${props.rkey}`, 37 + }); 38 + }} 39 + > 40 + <MdIosShare /> 41 + </ActionIcon> 42 + </Tooltip> 43 + )} 44 + </CopyButton> 45 + ); 46 + }
+46
src/webapp/features/semble/components/ShareHeaderButton/ShareHeaderButton.tsx
··· 1 + 'use client'; 2 + 3 + import { ActionIcon, CopyButton, Tooltip } from '@mantine/core'; 4 + import { notifications } from '@mantine/notifications'; 5 + import { useSearchParams } from 'next/navigation'; 6 + import { MdIosShare } from 'react-icons/md'; 7 + 8 + export default function ShareHeaderButton() { 9 + const searchParams = useSearchParams(); 10 + const rawId = searchParams.get('id'); 11 + 12 + if (!rawId) return null; 13 + 14 + const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/url?id=${rawId}`; 15 + 16 + return ( 17 + <CopyButton value={shareLink}> 18 + {({ copied, copy }) => ( 19 + <Tooltip 20 + label={copied ? 'Link copied!' : 'Share'} 21 + withArrow 22 + position="top" 23 + > 24 + <ActionIcon 25 + variant="light" 26 + color="gray" 27 + size={36} 28 + radius={'xl'} 29 + onClick={() => { 30 + copy(); 31 + 32 + if (copied) return; 33 + notifications.show({ 34 + message: 'Link copied!', 35 + position: 'top-center', 36 + id: copied.toString(), 37 + }); 38 + }} 39 + > 40 + <MdIosShare /> 41 + </ActionIcon> 42 + </Tooltip> 43 + )} 44 + </CopyButton> 45 + ); 46 + }
+1 -33
src/webapp/features/semble/components/sembleActions/SembleActions.tsx
··· 3 3 import AddCardToModal from '@/features/cards/components/addCardToModal/AddCardToModal'; 4 4 import RemoveCardFromLibraryModal from '@/features/cards/components/removeCardFromLibraryModal/RemoveCardFromLibraryModal'; 5 5 import useGetCardFromMyLibrary from '@/features/cards/lib/queries/useGetCardFromMyLibrary'; 6 - import { ActionIcon, Button, CopyButton, Group, Tooltip } from '@mantine/core'; 7 - import { notifications } from '@mantine/notifications'; 6 + import { ActionIcon, Button, Group } from '@mantine/core'; 8 7 import { Fragment, useState } from 'react'; 9 8 import { FiPlus } from 'react-icons/fi'; 10 9 import { IoMdCheckmark } from 'react-icons/io'; 11 - import { MdIosShare } from 'react-icons/md'; 12 10 import useSembleLibraries from '../../lib/queries/useSembleLibraries'; 13 11 import { track } from '@vercel/analytics'; 14 12 import { CardSaveSource } from '@/features/analytics/types'; ··· 36 34 37 35 const urlLibraryCount = allLibraries.length ?? 0; 38 36 39 - const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/url?id=${props.url}`; 40 - 41 37 if (cardStatus.error) { 42 38 return null; 43 39 } ··· 45 41 return ( 46 42 <Fragment> 47 43 <Group gap={'xs'}> 48 - <CopyButton value={shareLink}> 49 - {({ copied, copy }) => ( 50 - <Tooltip 51 - label={copied ? 'Link copied!' : 'Share'} 52 - withArrow 53 - position="top" 54 - > 55 - <ActionIcon 56 - variant="light" 57 - color="gray" 58 - size={36} 59 - radius={'xl'} 60 - onClick={() => { 61 - copy(); 62 - 63 - if (copied) return; 64 - notifications.show({ 65 - message: 'Link copied!', 66 - position: 'top-center', 67 - id: copied.toString(), 68 - }); 69 - }} 70 - > 71 - <MdIosShare /> 72 - </ActionIcon> 73 - </Tooltip> 74 - )} 75 - </CopyButton> 76 44 <Button 77 45 variant="light" 78 46 color="green"
-1
src/webapp/features/semble/containers/sembleActionsContainer/Skeleton.SembleActionsContainer.tsx
··· 4 4 return ( 5 5 <Stack gap="sm" align="center"> 6 6 <Group gap="xs"> 7 - <Skeleton w={36} h={36} circle /> 8 7 <Skeleton w={114} h={36} radius="xl" /> 9 8 <Skeleton w={113} h={36} radius="xl" /> 10 9 <Skeleton w={36} h={36} circle />