add custom page

src/components/leaderboard/ProgressModal.tsx

@@ -233,11 +233,14 @@ function ProgressPanel({
   const shareOnX = () => {
     const { isZero, value } = formatSUB(data?.earned)
     generateImage(image => {
+      const redirectTo = spaceHandleOrId ? `/${spaceHandleOrId}` : `/accounts/${myAddress}`
+      const title = 'I earned SUB for my activity on Subsocial!'
+      const desc = 'Follow me here and join The Creator Economy!'
       openNewWindow(
         twitterShareUrl(
-          spaceHandleOrId
-            ? `/${spaceHandleOrId}?customImage=${encodeURIComponent(image)}`
-            : `/accounts/${myAddress}`,
+          `/custom?image=${encodeURIComponent(image)}&title=${encodeURIComponent(
+            title,
+          )}&desc=${encodeURIComponent(desc)}&redirectTo=${encodeURIComponent(redirectTo)}`,
           `I earned ${isZero ? '' : `${value} `}#SUB ${
             isUsingLastWeekData ? 'last week for my activity' : 'yesterday'
           } on @SubsocialChain! 🥳\n\nFollow me here and join The Creator Economy!`,

src/pages/custom.tsx

@@ -0,0 +1,33 @@
+import { NextPageContext } from 'next'
+import { useRouter } from 'next/router'
+import { useEffect } from 'react'
+import { PageContent } from 'src/components/main/PageWrapper'
+
+export default function CustomPage({
+  desc,
+  image,
+  title,
+  redirectTo,
+}: {
+  image: string
+  title: string
+  desc: string
+  redirectTo: string
+}) {
+  const router = useRouter()
+  useEffect(() => {
+    router.push(redirectTo)
+  }, [])
+
+  return <PageContent meta={{ desc, image, title }} />
+}
+
+export const getInitialProps = async (context: NextPageContext) => {
+  const { image, title, desc, redirectTo } = context.query
+  return {
+    image,
+    title,
+    desc,
+    redirectTo,
+  }
+}