test of the new embed system
This commit is contained in:
		
							parent
							
								
									b126281e22
								
							
						
					
					
						commit
						52c1961ddf
					
				
							
								
								
									
										53
									
								
								src/app/share/[id].tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										53
									
								
								src/app/share/[id].tsx
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,53 @@ | ||||
| // pages/share/[id].tsx
 | ||||
| 
 | ||||
| import Head from "next/head"; | ||||
| import { GetServerSideProps } from "next"; | ||||
| 
 | ||||
| interface FileDetails { | ||||
|   name: string; | ||||
|   size: number; | ||||
|   owner: string; | ||||
|   uploadDate: string; | ||||
|   id: string; | ||||
|   url: string; | ||||
| } | ||||
| 
 | ||||
| export const getServerSideProps: GetServerSideProps = async (context) => { | ||||
|   const id = context.query.id as string; | ||||
| 
 | ||||
|   const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/share?id=${id}`); | ||||
|   if (!res.ok) { | ||||
|     return { | ||||
|       notFound: true, | ||||
|     }; | ||||
|   } | ||||
| 
 | ||||
|   const fileDetails: FileDetails = await res.json(); | ||||
| 
 | ||||
|   return { | ||||
|     props: { | ||||
|       fileDetails, | ||||
|     }, | ||||
|   }; | ||||
| }; | ||||
| 
 | ||||
| export default function SharePage({ fileDetails }: { fileDetails: FileDetails }) { | ||||
|   return ( | ||||
|     <> | ||||
|       <Head> | ||||
|         <title>{fileDetails.name}</title> | ||||
|         <meta property="og:title" content={fileDetails.name} /> | ||||
|         <meta property="og:description" content={`File shared by ${fileDetails.owner}`} /> | ||||
|         <meta property="og:image" content={fileDetails.url} /> | ||||
|         <meta property="og:url" content={`${process.env.NEXT_PUBLIC_BASE_URL}/share?id=${fileDetails.id}`} /> | ||||
|         <meta property="og:type" content="website" /> | ||||
|         <meta property="og:site_name" content="T3 File Share" /> | ||||
|       </Head> | ||||
|       <main className="text-white flex flex-col items-center justify-center min-h-screen bg-black"> | ||||
|         <h1 className="text-3xl font-bold mb-4">File: {fileDetails.name}</h1> | ||||
|         <p>Size: {(fileDetails.size / 1024).toFixed(2)} KB</p> | ||||
|         <p>Uploaded by: {fileDetails.owner}</p> | ||||
|       </main> | ||||
|     </> | ||||
|   ); | ||||
| } | ||||
| @ -4,6 +4,8 @@ import { Suspense } from "react"; | ||||
| import { useEffect, useState } from "react"; | ||||
| import { useSearchParams, useRouter } from "next/navigation"; | ||||
| import toast, { Toaster } from "react-hot-toast"; | ||||
| import Head from "next/head"; | ||||
| 
 | ||||
| // import { SharePage } from "~/components/SharePage";
 | ||||
| 
 | ||||
| interface FileDetails { | ||||
| @ -136,6 +138,15 @@ function UploadsPage() { | ||||
| 
 | ||||
|   return ( | ||||
|     <main className="relative flex min-h-screen flex-col items-center justify-center bg-gradient-to-b from-[#2e026d] to-[#15162c] text-white"> | ||||
|       <head> | ||||
|         <meta property="og:title" content={fileDetails.name} /> | ||||
|         <meta property="og:description" content={`File details for ${fileDetails.name}`} /> | ||||
|         <meta property="og:image" content={fileDetails.url} /> | ||||
|         <meta property="og:url" content={`${window.location.origin}/share?id=${fileDetails.id}`} /> | ||||
|         <meta property="og:type" content="website" /> | ||||
|         <meta property="og:site_name" content="File Hosting - Suchodupin" /> | ||||
|         <meta property="og:locale" content="en_US" /> | ||||
|       </head> | ||||
|       <Toaster position="top-right" reverseOrder={false} /> | ||||
|       <div className="absolute top-4 left-4"> | ||||
|         <button | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user