feat(ShareUrl): update for all new version (#56)

JSConfCL · Oct 2, 2024 · f0be0fe · f0be0fe
1 parent dc53ac3
commit f0be0fe
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 58 deletions.
diff --git a/src/components/Public/Ticket/Page.tsx b/src/components/Public/Ticket/Page.tsx
@@ -1,9 +1,5 @@
 import Head from "next/head";
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { Button, buttonVariants } from "@/components/ui/button";
-import { Footer } from "@/components/Footer/Footer";
-import { Header } from "@/components/Header/Header";
 import { Link } from "@/components/Link";
 import { SocialLink } from "@/components/SocialLink/SocialLink";
 import { JSCONF } from "@/lib/data";
@@ -37,8 +33,8 @@ const PublicTicketPage = ({
   ticketType,
   userInfo,
 }: TicketInfo) => {
-  const baseUrl = process.env.NEXT_PUBLIC_SERVER_URL ?? "https://jsconf.cl";
-  const publicUrl = `${baseUrl}/p/${shareType}/${id}`;
+  const ogImage = `${JSCONF.imagesApi}?ticketId=${id}`;
+  const publicUrl = `${JSCONF.shareWebpage}/public/ticket/${id}`;
   const twitterUrl = `Lista mi entrada para la @JSConfCL 🎉. Obtén la tuya en ${publicUrl} . Nos vemos el 05, 06 y 07 de Diciembre!`;
 
   const links = [
@@ -65,10 +61,7 @@ const PublicTicketPage = ({
           content="Mi Ticket para la JSConf Chile. Obtén tu ticket acá!"
         />
 
-        <meta
-          property="og:url"
-          content={`${JSCONF.imagesApi}?ticketId=${id}`}
-        />
+        <meta property="og:url" content={ogImage} />
 
         <meta property="og:type" content="website" />
         <meta
@@ -79,16 +72,13 @@ const PublicTicketPage = ({
           property="og:description"
           content="Mi Ticket para la JSConf Chile. Obtén tu ticket acá!"
         />
-        <meta property="og:image" content={`${""}/ticket/image/${id}`} />
+        <meta property="og:image" content={ogImage} />
         <meta name="twitter:site" content="@jsconfcl" />
         <meta name="twitter:creator" content="@jsconfcl" />
 
         <meta name="twitter:card" content="summary_large_image" />
         <meta property="twitter:domain" content="jsconf.cl" />
-        <meta
-          property="twitter:url"
-          content={`https://jsconf.cl/p/ticket/${id}`}
-        />
+        <meta property="twitter:url" content={publicUrl} />
         <meta
           name="twitter:title"
           content={`${userInfo.userName} 💛 JSConf Chile`}
@@ -97,55 +87,55 @@ const PublicTicketPage = ({
           name="twitter:description"
           content="Mi Ticket para la JSConf Chile. Obtén tu ticket acá!"
         />
-        <meta name="twitter:image" content={`${""}/ticket/image/${id}`} />
+        <meta name="twitter:image" content={ogImage} />
       </Head>
-      <Header />
-      <div className="mx-auto flex w-full flex-col gap-4 pt-4 md:container md:flex-row md:gap-16 md:py-16">
-        <div className="flex w-full items-center justify-end">
-          <PublicTicket
-            legalName={userInfo.legalName}
-            userName={userInfo.userName}
-          />
-        </div>
-        <div className="flex w-full grow items-center justify-start px-8 py-4">
-          <div className="flex w-full flex-col gap-4 text-center md:text-left">
-            <div className="font-barlow text-2xl font-semibold md:text-3xl">
-              Únete a la JSConf Chile 2024
-            </div>
-            <div className="font-barlow text-2xl font-semibold text-jsconf-yellow md:text-3xl">
-              Los días 5, 6 y 7 de diciembre
-            </div>
-            <div className="font-barlow text-base md:text-xl	">
-              Conoce más detalles visita loremipsum.com
-            </div>
-            <div className="flex flex-col gap-4 md:flex-row">
-              <Link
-                href={JSCONF.ticketsCommunity}
-                className={cn("py-3 w-full md:w-auto")}
-                target="_blank"
-                rel="noreferrer noopener"
-              >
-                Tickets
-              </Link>
-              <Link
-                href="/"
-                className="w-full bg-secondary py-3  text-secondary-foreground  hover:bg-secondary/80 md:w-auto"
-              >
-                JSConf 2024
-              </Link>
-            </div>
-            <div className="mt-4 flex flex-row items-center justify-center gap-4 md:justify-start">
-              <div>Compartir:</div>
-              <div className="flex flex-row text-jsconf-yellow">
-                {links.map((link) => (
-                  <SocialLink key={link.id} link={link} />
-                ))}
+      <div className="flex h-screen items-center justify-center">
+        <div className="mx-auto flex w-full flex-col gap-4 pt-4 md:container md:flex-row md:gap-16 md:py-16">
+          <div className="flex w-full items-center justify-end">
+            <PublicTicket
+              legalName={userInfo.legalName}
+              userName={userInfo.userName}
+            />
+          </div>
+          <div className="flex w-full grow items-center justify-start px-8 py-4">
+            <div className="flex w-full flex-col gap-4 text-center md:text-left">
+              <div className="font-barlow text-2xl font-semibold md:text-3xl">
+                Únete a la JSConf Chile 2024
+              </div>
+              <div className="font-barlow text-2xl font-semibold text-jsconf-yellow md:text-3xl">
+                Los días 5, 6 y 7 de diciembre
+              </div>
+              <div className="font-barlow text-base md:text-xl	">
+                Conoce más detalles visita loremipsum.com
+              </div>
+              <div className="flex flex-col gap-4 md:flex-row">
+                <Link
+                  href={JSCONF.ticketsCommunity}
+                  className={cn("py-3 w-full md:w-auto")}
+                  target="_blank"
+                  rel="noreferrer noopener"
+                >
+                  Tickets
+                </Link>
+                <Link
+                  href="/"
+                  className="w-full bg-secondary py-3  text-secondary-foreground  hover:bg-secondary/80 md:w-auto"
+                >
+                  JSConf 2024
+                </Link>
+              </div>
+              <div className="mt-4 flex flex-row items-center justify-center gap-4 md:justify-start">
+                <div>Compartir:</div>
+                <div className="flex flex-row text-jsconf-yellow">
+                  {links.map((link) => (
+                    <SocialLink key={link.id} link={link} />
+                  ))}
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
-      <Footer />
     </div>
   );
 };

diff --git a/src/lib/data.ts b/src/lib/data.ts
@@ -131,6 +131,7 @@ export const JSCONF = {
   strDates: "DIC 05, 06, 07 2024",
   place: "Santiago, Chile",
   imagesApi: process.env.NEXT_PUBLIC_IMAGES_API_URL ?? "",
+  shareWebpage: process.env.NEXT_PUBLIC_SHARE_WEBPAGE ?? "",
   webpage: process.env.NEXT_PUBLIC_WEBPAGE ?? "",
   ticketsCommunity: process.env.NEXT_PUBLIC_COMMUNITY_EVENT_URL ?? "",
   ticketsApi: process.env.NEXT_PUBLIC_TICKETS_API_URL ?? "",