src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[collectionId]/error.tsx src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[rkey]/error.tsx

View file Reviewed

+6 -3

src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[collectionId]/layout.tsx src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[rkey]/layout.tsx

View file Reviewed

··· 5 5 import { Fragment } from 'react'; 6 6 7 7 interface Props { 8 8 - params: Promise<{ collectionId: string }>; 8 8 + params: Promise<{ rkey: string; handle: string }>; 9 9 } 10 10 11 11 export async function generateMetadata({ params }: Props): Promise<Metadata> { 12 12 - const { collectionId } = await params; 12 12 + const { rkey, handle } = await params; 13 13 14 14 const apiClient = new ApiClient( 15 15 process.env.NEXT_PUBLIC_API_BASE_URL || 'http://localhost:3000', 16 16 createClientTokenManager(), 17 17 ); 18 18 19 19 - const collection = await apiClient.getCollectionPage(collectionId); 19 19 + const collection = await apiClient.getCollectionPageByAtUri({ 20 20 + recordKey: rkey, 21 21 + handle: handle, 22 22 + }); 20 23 21 24 return { 22 25 title: collection.name,

src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[collectionId]/loading.tsx src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[rkey]/loading.tsx

View file Reviewed

src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[collectionId]/opengraph-image.tsx src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[rkey]/opengraph-image.tsx

View file Reviewed

-11

src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[collectionId]/page.tsx

Reviewed

··· 1 1 - import CollectionContainer from '@/features/collections/containers/collectionContainer/CollectionContainer'; 2 2 - 3 3 - interface Props { 4 4 - params: Promise<{ collectionId: string }>; 5 5 - } 6 6 - 7 7 - export default async function Page(props: Props) { 8 8 - const { collectionId } = await props.params; 9 9 - 10 10 - return <CollectionContainer id={collectionId} />; 11 11 - }

+11

src/webapp/app/(dashboard)/profile/[handle]/(withoutHeader)/collections/[rkey]/page.tsx

View file Reviewed

··· 1 1 + import CollectionContainer from '@/features/collections/containers/collectionContainer/CollectionContainer'; 2 2 + 3 3 + interface Props { 4 4 + params: Promise<{ rkey: string; handle: string }>; 5 5 + } 6 6 + 7 7 + export default async function Page(props: Props) { 8 8 + const { rkey, handle } = await props.params; 9 9 + 10 10 + return <CollectionContainer handle={handle} rkey={rkey} />; 11 11 + }

+4 -1

src/webapp/features/collections/components/collectionCard/CollectionCard.tsx

View file Reviewed

··· 1 1 'use client'; 2 2 3 3 + import { getRecordKey } from '@/lib/utils/atproto'; 3 4 import { getRelativeTime } from '@/lib/utils/time'; 4 5 import { Card, Group, Stack, Text } from '@mantine/core'; 5 6 import { useRouter } from 'next/navigation'; ··· 8 9 size?: 'large' | 'compact' | 'list' | 'basic'; 9 10 collection: { 10 11 id: string; 12 12 + uri?: string; 11 13 name: string; 12 14 description?: string; 13 15 cardCount: number; ··· 25 27 export default function CollectionCard(props: Props) { 26 28 const router = useRouter(); 27 29 const { collection } = props; 30 30 + const rkey = getRecordKey(collection.uri!!); 28 31 const time = getRelativeTime(collection.updatedAt); 29 32 const relativeUpdateDate = 30 33 time === 'just now' ? `Updated ${time}` : `Updated ${time} ago`; ··· 35 38 withBorder 36 39 onClick={() => 37 40 router.push( 38 38 - `/profile/${collection.createdBy.handle}/collections/${collection.id}`, 41 41 + `/profile/${collection.createdBy.handle}/collections/${rkey}`, 39 42 ) 40 43 } 41 44 radius={'lg'}

+6 -4

src/webapp/features/collections/containers/collectionContainer/CollectionContainer.tsx

View file Reviewed

··· 22 22 import CollectionActions from '../../components/collectionActions/CollectionActions'; 23 23 import CollectionContainerError from './Error.CollectionContainer'; 24 24 import CollectionContainerSkeleton from './Skeleton.CollectionContainer'; 25 25 + import { log } from 'node:console'; 25 26 26 27 interface Props { 27 27 - id: string; 28 28 + rkey: string; 29 29 + handle: string; 28 30 } 29 31 30 30 - export default function CollectionContainer({ id }: Props) { 32 32 + export default function CollectionContainer(props: Props) { 31 33 const { 32 34 data, 33 35 isPending, ··· 35 37 fetchNextPage, 36 38 hasNextPage, 37 39 isFetchingNextPage, 38 38 - } = useCollection({ id }); 40 40 + } = useCollection({ rkey: props.rkey, handle: props.handle }); 39 41 40 42 const [showAddDrawer, setShowAddDrawer] = useState(false); 41 43 ··· 94 96 95 97 <Group justify="end"> 96 98 <CollectionActions 97 97 - id={id} 99 99 + id={props.rkey} 98 100 name={firstPage.name} 99 101 description={firstPage.description} 100 102 authorHandle={firstPage.author.handle}

+9 -3

src/webapp/features/collections/lib/queries/useCollection.tsx

View file Reviewed

··· 3 3 import { useSuspenseInfiniteQuery } from '@tanstack/react-query'; 4 4 5 5 interface Props { 6 6 - id: string; 6 6 + rkey: string; 7 7 + handle: string; 7 8 limit?: number; 8 9 } 9 10 ··· 16 17 const limit = props.limit ?? 20; 17 18 18 19 return useSuspenseInfiniteQuery({ 19 19 - queryKey: ['collection', props.id, limit], 20 20 + queryKey: ['collection', props.rkey, props.handle, limit], 20 21 initialPageParam: 1, 21 22 queryFn: ({ pageParam }) => 22 22 - apiClient.getCollectionPage(props.id, { limit, page: pageParam }), 23 23 + apiClient.getCollectionPageByAtUri({ 24 24 + recordKey: props.rkey, 25 25 + handle: props.handle, 26 26 + limit, 27 27 + page: pageParam, 28 28 + }), 23 29 getNextPageParam: (lastPage) => { 24 30 return lastPage.pagination.hasMore 25 31 ? lastPage.pagination.currentPage + 1

+1

src/webapp/lib/utils/atproto.ts

View file Reviewed

··· 1 1 + export const getRecordKey = (path: string) => path.split('/').pop() || '';